<template>
	<view class=" ">
		<view class=" bg-white">
			<view class="hede-title banmi_flex a-c">
				<view class="c-text">
					应用详情
				</view>
			</view>
	 
			<view>
				<view class="banmi_flex p-20 bb">
					<view class=" pl-name">H5应用二维码:</view>
					<view class="" style="width: 150px;">
						<yz-qr style="margin-top: -14rpx;" :qrPath.sync="qrPath" :text="text" :size="size"
							:quality="quality" :colorDark="colorDark" :colorLight="colorLight"></yz-qr>
					</view>
				</view>
				<view class="banmi_flex p-20 bb a-c">
					<view class=" pl-name">H5主页连接:</view>
					<text class="f-15">{{text}}</text>

				</view>
				<view class="banmi_flex  bb a-c" style="padding: 0px 20px;margin-top: -10px;">
					<view class=" pl-name"></view>
					<view class="banmi_flex  ">
						<button @click="on_copy(text)" class="a-but" type="primary">
							<text class="f-14">复制</text>
						</button>
						<button @click="on_set('h5',find.is_h5_home)" class="m-l-10 a-but" type="primary" :class="find.is_h5_home?'is-b':''" >
							<text class="f-14">{{find.is_h5_home?"取消首页":"设为首页"}} </text>
						</button>
					</view>
				</view>
				<view class="banmi_flex p-20 bb a-c">
					<view class=" pl-name">PC主页连接:</view>
					<text class="f-15">{{find.pc_url}}</text>
				</view>
				<view class="banmi_flex  bb a-c" style="padding: 0px 20px;margin-top: -10px;">
					<view class=" pl-name"></view>
					<view class="banmi_flex  ">
						<button @click="on_copy(find.pc_url)" class="  a-but" type="primary">
							<text class="f-14">复制</text>
						</button>
						<button @click="on_set('pc',find.is_pc_home)" class="m-l-10 a-but" type="primary"  :class="find.is_pc_home?'is-b':''">
							<text class="f-14">{{find.is_pc_home?"取消首页":"设为首页"}}</text>
						</button>
					</view>
				</view>
				<view class="banmi_flex p-20 bb a-c">
					<view class=" pl-name"></view>
					<text class="f-15 cred">提示:设为首页后通过{{find.home_url}}即可访问</text>


				</view>
				<view class="banmi_flex p-20 bb">
					<view class=" pl-name">应用名称:</view>
					<text class="f-15">{{find.plugin_name}}</text>
				</view>
				<view class="banmi_flex p-20 bb">
					<view class=" pl-name">应用唯一标示:</view>
					<text class="f-15">{{find.catalogue}}</text>
				</view>
				<view class="banmi_flex p-20 bb">
					<view class=" pl-name">配置uniapp源码:</view>
					<view class="">
						<button @click="on_configuration(find.catalogue)" class=" a-but" type="primary">
							<text class="f-14">一键配置接口</text>
						</button>
					</view>
				</view>
				<view class="banmi_flex p-20 bb a-c" style="margin-top: -20px;">
					<view class=" pl-name"></view>
					<text class="f-15 cred">提示:使用此功能需把源码放到以下目录</text>
				</view>
				<view class="banmi_flex p-20 bb a-c" style="margin-top: -30px;">
					<view class=" pl-name"></view>
					<text class="f-15 " style="color: blue;">管理端源码放到plugin/{{find.catalogue}}/uniapp/admin/</text>
				</view>
				<view class="banmi_flex p-20 bb a-c" style="margin-top: -35px;">
					<view class=" pl-name"></view>
					<text class="f-15 " style="color: blue;">用户端源码放到plugin/{{find.catalogue}}/uniapp/home/</text>
				</view>
				<view class="banmi_flex p-20 bb a-c" style="margin-top: -35px;">
					<view class=" pl-name"></view>
					<text class="f-15 cred"  >修改成功后下载导入到uniapp编辑器就可以直接运行了不需要再配置接口</text>
				</view>



			</view>
		</view>


	</view>
</template>

<script>
	import $C from '@/common/banmi/config.js';

	function updata(result, find, c_type) {
		uni.showLoading({
			title: '正在上传中'
		})
		var catalogue = find.catalogue;
		uni.uploadFile({
			url: $C.baseUrl + '/admin.Mysql/upload',
			filePath: result,
			name: 'file',
			formData: {
				'catalogue': catalogue,
				'c_type': c_type,
				'token': uni.getStorageSync('admin_token'),
				'admin_token': uni.getStorageSync('admin_token'),
			},
			success: (uploadFileRes) => {
				var dataString = uploadFileRes.data
				var dataObject = JSON.parse(dataString);
				uni.showToast({
					title: dataObject.msg,
				})
			}
		});
	}

	function getCaption(obj, state) {
		var index = obj.lastIndexOf("#/");
		if (state == 0) {
			obj = obj.substring(0, index);
		} else {
			obj = obj.substring(index + 1, obj.length);
		}
		return obj;
	}

	export default {
		data() {
			return {
				menu_list: [],
				admin_url: '',
				config: {},
				//二维码相关参数
				qrPath: '',
				text: '',
				wx_applet: 1,
				size: 100,
				quality: 'L',
				colorDark: '#000000',
				colorLight: '#ffffff',
				find: {},
				up_find: {},
				menu_name: '',
				menu_url: '',
				plugin_id: ''


			}
		},
		onShow() {
			this.tuodong()
		},
		onLoad(on) {

			this.cid_id = on.banmi_plugin ? on.banmi_plugin : on.id;

			var catalogue = '';

			var menu_list = uni.getStorageSync('menu_list');
			for (var i = 0; i < menu_list.length; i++) {

				if (menu_list[i]['menu_id'] == this.cid_id) {
					catalogue = menu_list[i]['plugin_catalogue']
					this.plugin_id = menu_list[i]['plugin_id']
				}
			}
			this.admin_catalogue = catalogue;

			this.init()

		},
		methods: {
			async on_configuration(catalogue) {

				uni.showLoading({
					title: "正在设置中...",
					mask: true
				})
				let that = this;
				let requestParams = {
					catalogue: catalogue,
				};
				const ret = await this.Banmikeji.Pluginlist_configuration_plugin(requestParams);

				setTimeout(function() {
					uni.hideLoading()
					uni.showToast({
						title: ret.msg,
						icon: "none"
					})
					 
				}, 1000); 
				 
			},
			on_url(url) {
				window.open(url, '_blank')
			},
			async on_set(type,is_home) { 
				let that = this;
				let requestParams = {
					admin_catalogue: this.admin_catalogue,
					plugin_id: this.plugin_id,
					type: type,
					is_home:is_home
				};
				const ret = await this.Banmikeji.Pluginlist_set_home(requestParams);
				
				this.init()

				uni.showToast({
					title: ret.msg,
					icon: "none"
				})
			},
 
			tuodong() {
				var that = this;
				setTimeout(function() {
					if (that.nav_index == 0) {
						try {
							var find = that.find;
							var dp = document.getElementById('drop_area');
							dp.addEventListener('dragover', function(e) {
								e.stopPropagation();
								e.preventDefault();
								e.dataTransfer.dropEffect = 'copy';
							});

							dp.addEventListener("drop", function(e) {
								e.stopPropagation();
								e.preventDefault();
								var files = e.dataTransfer.files;
								for (var i = 0; i < files.length; i++) {
									var file = files[i]; //获取每个文件
									var reader = new FileReader(); //创建文件读取对象
									//读完回调事件 
									reader.onload = function(f) {
										updata(this.result, find, 2);
									}
									var isaa = reader.readAsDataURL(file); //把图片读成Base64编码字符串
								}
							});
							var dp_a = document.getElementById('drop_area_a');
							dp_a.addEventListener('dragover', function(e) {
								e.stopPropagation();
								e.preventDefault();
								e.dataTransfer.dropEffect = 'copy';
							});

							dp_a.addEventListener("drop", function(e) {
								e.stopPropagation();
								e.preventDefault();
								var files = e.dataTransfer.files;
								for (var i = 0; i < files.length; i++) {
									var file = files[i]; //获取每个文件
									var reader = new FileReader(); //创建文件读取对象
									//读完回调事件 
									reader.onload = function(f) {
										updata(this.result, find, 1);

									}
									var isaa = reader.readAsDataURL(file); //把图片读成Base64编码字符串

								}
							});
						} catch (e) {
							//TODO handle the exception
						}





					}

				}, 2000);
			},
			up_tuodong(filePath) {
				uni.uploadFile({
					url: $C.baseUrl + '/admin.Mysql/upload',
					filePath: filePath,
					name: 'file',
					formData: {
						'catalogue': catalogue,
						'c_type': c_type,
						'token': uni.getStorageSync('admin_token'),
						'admin_token': uni.getStorageSync('admin_token'),
					},
					success: (uploadFileRes) => {
						var dataString = uploadFileRes.data
						var dataObject = JSON.parse(dataString);
						uni.showToast({
							title: dataObject.msg,
						})
					}
				});
			},
			up_file(c_type) {
				this.c_type = c_type
			},
			async on_zip() {
				if (!this.find.catalogue) {
					uni.showToast({
						title: '请选择插件',
						icon: 'error'

					})
					return
				}
				uni.showLoading({
					title: '正在打包中，预计40秒'
				})
				let requestParams = {
					name: this.find.catalogue,
				};
				const ret = await this.Banmikeji.Mysql_set_bale(requestParams);
				uni.showToast({
					title: ret.msg,
					icon: 'none'
				})
				this.zip_url = ret.data.zip_url
			},

			on_copy(url) {
				uni.setClipboardData({
					data: url,
					success: function() {
						uni.showToast({
							title: '复制网址成功'
						})
					}
				});
			},

			async init(index) {
				let that = this;

				let requestParams = {
					admin_catalogue: this.admin_catalogue,
					plugin_id: this.plugin_id
				};
				const ret = await this.Banmikeji.Pluginlist_home_index(requestParams);
				this.menu_list = ret.data.menu_list;
				this.find = ret.data.find;
				if (this.find) {
					uni.setStorageSync('developer', this.find.is_my);
					this.text = ret.data.find['h5_url'];
				}

				this.is_install = ret.data.is_install;
				this.config = ret.data.config;

			},





		}
	}
</script>

<style>
	.pl-name {
		color: #A9A9A9;
		width: 120px;
		flex-shrink: 0;
		font-size: 14px;
	}

	.f28 {
		font-size: 28rpx;
	}

	.a-but {
		border-radius: 10rpx;
		height: 25px;
		line-height: 25px;
	}
	.is-b{
		background-color: #C0C0C0;
	}
</style>